import React, { Component } from "react";
class ExampleComponent extends Component {
  constructor(props) {
    super(props);
    //2. bind this problem
    this.handler = function(UIEvent) {};
    //2. bind this problem
    this._click = this._click.bind(this);
  }
  componentDidMount() {
    //1. sideEffect
    window.addEventListener("resize", this.handler);
    this.fetchData();
  }
  componentWillUnmount() {
    //1. sideEffect when unmount
    window.removeEventListener("resize", this.handler);
  }
  fetchData() {
      // 3. logical twice
    fetch("http://baidu.com")
      .then((res) => res.text())
      .then((body) => {
        console.table(body);
      });
  }
  _click(e) {
    this.fetchData();
  }
  render() {
    return <button onClick={this._click}>Click Me!</button>;
  }
}
export default ExampleComponent;
